<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <meta name="viewport"
          content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">

    <title>订单管理</title>

    <link href="__PUBLIC__/AmazeUI-2.4.2/assets/css/amazeui.css" rel="stylesheet" type="text/css"/>
    <link href="__PUBLIC__/AmazeUI-2.4.2/assets/css/admin.css" rel="stylesheet" type="text/css"/>

    <link href="__PUBLIC__/basic/css/demo.css" rel="stylesheet" type="text/css"/>

    <link rel="stylesheet" href="__PUBLIC__/css/index.css">
    <!--必要样式-->
    <style>

        body {
            font-family: "Microsoft Yahei", 微软雅黑, arial, "Lantinghei SC";
            background: #EFEFEF;
        }

        .am-nav-tabs > ul {
            border-bottom: 1px solid #DADADA;
        }

        .am-nav-tabs > li > a {
            font-size: 14px;
            padding: 0.4em 0.2em;
        }

        .am-tabs-nav li {
            height: 40px;
            line-height: 40px;
        }

        .am-nav-tabs > li {
            border-bottom: 1px solid #DADADA;
        }

        .am-nav-tabs.am-nav-justify > li > a {
            border-bottom: none;
        }

        .am-tabs-bd .am-tab-panel {
            padding: 0 10px 0px;
            margin-bottom: 15px;
        }

        .order-title .am-u-sm-12 {
            padding: 6px 6px;
            border-bottom: 1px solid #F2F2F2;
        }

        .order-title .am-u-sm-12 span {
            font-size: 18px;
            color: #000;
            vertical-align: middle;
            display: inline-block;
            line-height: 25px;
            margin-left: 8px;
        }

        .goods-box {
            margin-bottom: 10px;
        }

        .goods-box .goods-head {
            border-bottom: 1px solid #F3F3F3;
            padding: 15px 20px 10px;
            font-size: 13px;
        }

        .goods-box .good-content {
            padding: 10px 5px 0px 0;
            border-bottom: 1px solid #D8D8D8;
        }

        .goods-box .good-content .title {
            position: absolute;
            top: 3px;
            color: #2C2D2F;
            font-size: 11px;
            height: 55px;
            line-height: 18px;
            display: -webkit-box;
            -webkit-box-orient: vertical;
            -webkit-line-clamp: 3;
            overflow: hidden;
            letter-spacing: 0;
            vertical-align: middle;
        }

        .goods-box .good-content .map {
            color: #787878;
            font-size: 9px;
            position: absolute;
            top: 58px;
            left: 110px;
        }

        .goods-box .good-price {
            margin-bottom: 10px;
        }

        .goods-box .good-price .money {
            text-overflow: ellipsis;
            display: block;
            line-height: 30px;
        }

        .goods-box .good-price .num {
            margin-left: 3px;
            color: #898989;
        }

        .goods-box .good-totol {
            margin-bottom: 15px;
        }

        .goods-box .good-totol span {
            display: block;
            font-size: 13px;
        }

        .btn1 {
            display: inline-block;
            border: 1px solid #E3E3E3;
            color: #7A7E7F;
            padding: 7px 6px;
            border-radius: 3px;
            margin-right: 10px;
        }

        .btn2 {
            display: inline-block;
            color: #FFFFFF;
            background: #FFAD01;
            padding: 7px 6px;
            border-radius: 3px;
        }
    </style>
</head>

<body>
<div class="am-g bg-white order-title" >
    <div class="am-u-sm-12" onclick="back()">
        <img src="__PUBLIC__/new_images/left.png" width="28" alt=""> <span>订单管理</span>
    </div>
</div>
<div class="am-g ">
    <div class="am-tabs " id="doc-my-tabs">
        <ul class="am-tabs-nav am-nav am-nav-tabs am-nav-justify bg-white ">
            <eq name="type" value="0">
                <li class="am-active">
                    <else/><li>
            </eq><a href="">所有订单</a></li>
            <eq name="type" value="1">
                <li class="am-active">
                    <else/><li>
            </eq><a href="">待付款</a></li>
            <eq name="type" value="2">
                <li class="am-active">
                    <else/><li>
            </eq><a href="">待发货</a></li>
            <eq name="type" value="3">
                <li class="am-active">
                    <else/><li>
            </eq><a href="">待收货</a></li>
            <eq name="type" value="4">
                <li class="am-active">
                    <else/><li>
            </eq><a href="">待评价</a></li>
        </ul>
        <div class="am-tabs-bd " style="margin-top: 10px;">
            <!--所有订单-->
            <eq name="type" value="0">
                <div class="am-tab-panel am-active">
                    <else/><div class="am-tab-panel">
            </eq>
            <!--无订单时。统一显示-->
            <!--<div class="am-g am-text-center">-->
            <!--<img src="__PUBLIC__/new_images/order.png" alt="" width="140" style="margin-top: 65px;">-->
            <!--<span style="font-size: 18px;color: #BFBFBF;display: block;margin-top: 30px;letter-spacing: 2px;">您还没有订单~</span>-->
            <!--</div>-->
            <!--有订单时-->
            <empty name="allOrderList">
                <div class="am-g am-text-center">
                    <img src="__PUBLIC__/new_images/order.png" alt="" width="140" style="margin-top: 65px;">
                    <span style="font-size: 18px;color: #BFBFBF;display: block;margin-top: 30px;letter-spacing: 2px;">您还没有订单~</span>
                </div>
                <else/>
                <volist name="allOrderList" id="order">
                    <include file="Public:order_goods_list" />
                </volist>
            </empty>
        </div>
        <!--待付款-->
        <eq name="type" value="1">
            <div class="am-tab-panel am-active">
                <else/><div class="am-tab-panel">
        </eq>
        <!--无订单时。统一显示-->
        <empty name="payOrderList">
            <div class="am-g am-text-center">
                <img src="__PUBLIC__/new_images/order.png" alt="" width="140" style="margin-top: 65px;">
                <span style="font-size: 18px;color: #BFBFBF;display: block;margin-top: 30px;letter-spacing: 2px;">您还没有订单~</span>
            </div>
            <else/>
            <volist name="payOrderList" id="order">
                <include file="Public:order_goods_list" />
            </volist>
        </empty>
    </div>
    <eq name="type" value="2">
        <div class="am-tab-panel am-active">
            <else/><div class="am-tab-panel">
    </eq>
    <empty name="shipmentOrderList">
        <div class="am-g am-text-center">
            <img src="__PUBLIC__/new_images/order.png" alt="" width="140" style="margin-top: 65px;">
            <span style="font-size: 18px;color: #BFBFBF;display: block;margin-top: 30px;letter-spacing: 2px;">您还没有订单~</span>
        </div>
        <else/>
        <volist name="shipmentOrderList" id="order">
            <include file="Public:order_goods_list" />
        </volist>
    </empty>

</div>
<!--待收货-->
<eq name="type" value="3">
    <div class="am-tab-panel am-active">
        <else/><div class="am-tab-panel">
</eq>
<empty name="receivedOrderList">
    <div class="am-g am-text-center">
        <img src="__PUBLIC__/new_images/order.png" alt="" width="140" style="margin-top: 65px;">
        <span style="font-size: 18px;color: #BFBFBF;display: block;margin-top: 30px;letter-spacing: 2px;">您还没有订单~</span>
    </div>
    <else/>
    <volist name="receivedOrderList" id="order">
        <include file="Public:order_goods_list" />
    </volist>
</empty>
</div>
<!--待评价-->
<eq name="type" value="4">
    <div class="am-tab-panel am-active">
        <else/><div class="am-tab-panel">
</eq>
<empty name="evaluationOrderList">
    <div class="am-g am-text-center">
        <img src="__PUBLIC__/new_images/order.png" alt="" width="140" style="margin-top: 65px;">
        <span style="font-size: 18px;color: #BFBFBF;display: block;margin-top: 30px;letter-spacing: 2px;">您还没有订单~</span>
    </div>
    <else/>
    <volist name="evaluationOrderList" id="order">
        <include file="Public:order_goods_list" />
    </volist>
</empty>
</div>
</div>
</div>

</div>
<script src="__PUBLIC__/AmazeUI-2.4.2/assets/js/jquery.min.js"></script>
<script src="__PUBLIC__/AmazeUI-2.4.2/assets/js/amazeui.min.js"></script>
<script type="text/javascript" src="__PUBLIC__/layer/layer.js"></script>
<style>
.layui-layer-btn .layui-layer-btn0 {
border-color: #ffad01;
background-color: #ffad01;
color: #fff;
}
</style>
<script>
    $(function () {
        $('#doc-my-tabs').tabs();
    });
    $(function () {
        var w = document.body.clientWidth / 12 * 10 - 110;
        $('.title').css('width', w);
        $('.title').css('left', 110);
    });
    function back() {
        if (/(iPhone|iPad|iPod)/i.test(navigator.userAgent)) {
            window.location.href = window.document.referrer;
        } else { window.history.go("-1"); }
    }
    function modalInfo(info,success){
        layer.msg(info);
//        if(success) {
//            layer.msg(info, {icon: 1});
//        }else{
//            layer.msg(info, {icon: 2});
//        }

    }
    function remindShipment(){
        modalInfo('已经提醒商家发货',true);
    }
    function deleteOrder(order_id) {
        layer.msg('您确认删除该订单？', {
            time: 0 //不自动关闭
            ,btn: ['确认', '取消']
            ,yes: function(){
                $.ajax({
                    url:"__APP__/Home/Order/deleteOrder",
                    data:{
                        order_id:order_id,
                    },
                    success: function(data){
                        modalInfo(data.message,data.success);
                        if(data.success) {
                            var id = 'order_'+ order_id;
                            $('.' + id).hide();
                        }
                    },
                    error:function (data) {
                        modalInfo('服务器繁忙！',false);
                    }
                });
            }
        });
    /*    layer.confirm('您确认删除该订单？', {
            btn: ['确认','取消']
        }, function(){
            $.ajax({
                url:"__APP__/Home/Order/deleteOrder",
                data:{
                    order_id:order_id,
                },
                success: function(data){
                    modalInfo(data.message,data.success);
                    if(data.success) {
                        var id = 'order_'+ order_id;
                        $('.' + id).hide();
                    }
                },
                error:function (data) {
                    modalInfo('服务器繁忙！',false);
                }
            });
        }, function(){

        });*/
    }

    function confirmReceipt(order_id) {
        layer.msg('您确认要收货？', {
            time: 0 //不自动关闭
            ,btn: ['确认', '取消']
            ,yes: function(){
        $.ajax({
            url:"__APP__/Home/Order/confirmReceipt",
            data:{
                order_id:order_id,
            },
            success: function(data){
                console.info(data);
                modalInfo(data.message,data.success);
                if(data.success){
                    var classname = 'order_' + order_id;
                    $('.'+classname).hide();
                }
//                if(data.success) {
//                    var id = 'goods_' + goods_id + '_' + order_id;
//                    $('#' + id).hide();
//                }
            },
            error:function (data) {
                console.info(data);
                modalInfo('服务器繁忙！',false);
            }
        });
            }
        });
    }


    //退款请求
    function applyRefund(order_id){
        layer.msg('您确定要退款吗?'
                ,{
                    time:0
                    , btn: ['确认', '取消']
                    ,yes:function (index, layero) {
                        layer.close(index);
                        $.ajax({
                            type:"post",
                            url:"__APP__/Home/Order/applyRefund",
                            data:{
                                order_id : order_id
                            },
                            error:function (data) {
                                console.info(data);
                                layer.msg('服务器异常');
                            },
                            success:function (data) {
                                console.info(data);
                                layer.msg(data.msg);
                                if(data.status > 0) {
                                    var id = 'order_'+ order_id;
                                    $('.' + id).hide();
                                }
                            }

                        });
                    }
                }
        )
    }
</script>
</body>
</html>